<template>
  <div class="detlete">
    <ul>
      <li
        class="titleList"
        v-for="(item,index) in arrAy"
        :key="index"
        @click="datailc(item.id)"
      >{{item.title}}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "detlete",
  data() {
    return {
      id: "ask",
      num: 1,
      arrAy: []
    };
  },
  created() {
    this.id = this.$route.query.id;
    this.getData("ask");
    console.log(this.id);
  },
  computed: {},
  watch: {
    // '$route': function(to,from) {
    //     console.log(to)
    //     console.log(from)
    //   this.getData(to.query.id);
    // }
  },

  methods: {
    getData(id) {
      this.$http.get(`/api/topics?tab=${id}`).then(res => {
        // console.log(res.data.data);
        this.arrAy = res.data.data;
      });
    },
    datailc(idnum) {
      this.$router.push({
        path: "/index/page/detlete/datailc",
        query: {
          id: idnum
        }
      });
    }
  },

  mounted() {},
  beforeCreate() {},
  beforeMount() {},
  beforeUpdate() {},
  updated() {},
  beforeDestroy() {},
  destroyed() {},
  activated() {},
  components: {}
};
</script>

<style  scoped>
.titleList {
  padding: 20px;
}
</style>